//商品列表
'use strict';
import React,{Component} from 'react';
import Header from '../common/header';
import Icon from 'react-native-vector-icons';
import * as URLconstant from '../constant/URLconstant';
import Util from '../common/util';
import Goodsindex from './goodsIndex';
import Toast from '../common/ToastUtil';
import {
    View,
    Text,
    TouchableOpacity,
    Image,
    ScrollView,
    ActivityIndicator,
    StyleSheet,
    FlatList
} from 'react-native';
import MyStroage from "../common/myStroage";
export default class goodsList extends Component {
    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            loaded: false,
            goodsList:null,
            page:1,
            limit:10,
            again:true,
            isOver:false
        }
    }

    componentDidMount() {
        this.getUser()

    }

    async getUser(){
        let userInfoDate = await MyStroage.getStorageAllDataForKey('userinfo')
        let user_id = userInfoDate.data.user_id
        await this.setState({
            user_id:user_id
        })
        this.getGoodsList();
    }


    //初始请求
    getGoodsList() {
        let user_id = this.state.user_id
        let url
        let params = this.props.route.params
        let datakey=[]
        let isSearch = params.isSearch
        datakey['user_id']=user_id
        if(isSearch){
            let key_words = params.title
            url = URLconstant.GOODSSEARCH_URL
            datakey['key_words'] = key_words;
            datakey['limit']=this.state.limit
            datakey['page'] = this.state.page
            Util.get(url,datakey,this.getSearchListSuc.bind(this),this.errorCallback.bind(this))
        }else{
            let cate_id = params.cate_id
            let attr_id = params.attr_id||''
            url = URLconstant.CATE_GOODS_LIST
            datakey['cate_id'] = cate_id
            datakey['attr_id']=attr_id
            datakey['limit']=this.state.limit
            datakey['page'] = this.state.page
            Util.get(url,datakey,this.getListSuc.bind(this),this.errorCallback.bind(this))
        }
    }

    getListSuc(datas){
        if(datas.status==0){
            let list = datas.data
            let limit = this.state.limit
            let again = true
            let isOver = false
            if(list.length<limit){
                again = false
                isOver = true
            }
            let hasGoods = true
            let page = this.state.page
            if(page==1&&list.length==0){
                hasGoods=false
            }
            let goodsList = this.state.goodsList;
            if(goodsList==null){
                goodsList=[]
            }
            Array.prototype.push.apply(goodsList, list);
            this.setState({
                goodsList:goodsList,
                hasGoods:hasGoods,
                isOver:isOver,
                again:again,
                loaded:true
            })
        }else{
            this.setState({
                hasGoods:false,
                isOver:true,
                again:false,
                loaded:true,
                goodsList:[]
            })
        }
    }


    getSearchListSuc(datas){
        if(datas.status==0){
            let list = datas.data.list
            let limit = this.state.limit
            let again = true
            let isOver = false
            if(goodsList.length<limit){
                again = false
                isOver = true
            }
            let hasGoods = true
            let page = this.state.page
            if(page==1&&goodsList.length==0){
                hasGoods=false
            }
            let goodsList = this.state.goodsList;
            if(goodsList==null){
                goodsList=[]
            }
            Array.prototype.push.apply(goodsList, list);
            this.setState({
                goodsList:goodsList,
                hasGoods:hasGoods,
                isOver:isOver,
                again:again,
                loaded:true
            })
        }else{
            this.setState({
                hasGoods:false,
                isOver:true,
                again:false,
                loaded:true,
                goodsList:[]
            })
        }
    }

    errorCallback(err) {
        LOG('ERROR-' + err);
    }

    //跳转到商品详情
    gogoodsindex(goods_id) {
        this.props.navigation.push('GoodsIndex',{
            goods_id:goods_id
        })
    }


    async onEndReached() {
        if (this.state.again) {
            await this.setState({
                page:this.state.page+1
            })
            this.getGoodsList()
        }
    }


    renderFooter(){
        return (
            <View style={{height:30,alignItems:'center',justifyContent:'center',width:Util.size.width}}>
                <Text style={{fontSize:12,color:"#969696"}}>{this.state.isOver?"没有更多数据了":"正在加载中"}</Text>
            </View>
        )
    }


    toFixNum(num){
        return parseFloat(num).toFixed(2)
    }

    _renderRow =({item})=>{
        return(
            <TouchableOpacity key={item.goods_id}
                              onPress={()=>this.gogoodsindex(item.goods_id)}
                              style={{width:(Util.size.width-30)/2,height:(Util.size.width-30)/2+60,marginLeft:10}}>
                <Image
                    source={{uri:item.default_image}}
                    resizeMode={'cover'}
                    style={{width:(Util.size.width-30)/2,height:(Util.size.width-30)/2}}
                />
                <View style={{paddingHorizontal:10,justifyContent:'space-around',paddingVertical:5,backgroundColor:"#fff"}}>
                    <Text numberOfLines={1} style={{fontSize:14,color:"#333",marginBottom:2}}>{item.goods_name}</Text>
                    <Text style={{fontSize:12,color:"#f00"}}>{this.toFixNum(item.price)}/米</Text>
                </View>
            </TouchableOpacity>
        )
    }

    render() {
        let params = this.props.route.params
        return(
            <View style={{flex:1,backgroundColor:"#f0f0f0"}}>
                <Header navigation={this.props.navigation} title={params.title}/>
                {
                    !this.state.loaded?
                        <View style={{flex:1}}>
                            {Util.loading()}
                        </View>:
                        <View style={{flex:1,}}>
                            {
                                !this.state.hasGoods?
                                    <View style={{flex:1,alignItems:'center',justifyContent:'center'}}>
                                        <Text>没有商品</Text>
                                    </View>:
                                    <FlatList
                                        style={{paddingTop:10}}
                                        numColumns={2}
                                        data={this.state.goodsList}
                                        renderItem={this._renderRow}
                                        onEndReached={this.onEndReached.bind(this)}
                                        keyExtractor={item => item.goods_id}
                                        ListFooterComponent={this.renderFooter.bind(this)}
                                    />
                            }
                        </View>
                }
            </View>
        )
    }
}
var styles = StyleSheet.create({
    goods_list_wrap:{
        flexDirection:'row',
        padding:10,
        flexWrap:'wrap',
        justifyContent:'space-between'
    }
})